<link rel="stylesheet" href="__PUBLIC__/js/jquery-upload/css/jquery.fileupload-ui.css" />
<link rel="stylesheet" href="__PUBLIC__/js/jquery-upload/css/jquery.fileupload.css" />
<link rel="stylesheet" href="__PUBLIC__/css/select2/select2.min.css" />
<div class="modal-dialog" role="document">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="exampleModalLabel">编辑</h4>
        </div>
        <form class="form-horizontal" style="padding:4%;height:500px;overflow-y:auto;"  id="advForm" data-toggle="validator">

            <input type="hidden"  name="advId" value="{$advInfo.id}"/>
            <div class="form-group">
                <label for="recipient-name" class="control-label col-sm-3"><span style="color:red;">*</span>轮播名称:</label>
                <div class="col-sm-4">
                    <input type="text" class="form-control" name="name" value="{$advInfo.name}"   value="" required>
                </div>
            </div>
            <div class="form-group">
                <label for="recipient-name" class="control-label col-sm-3">按钮文本:</label>
                <div class="col-sm-4">
                    <input type="text" class="form-control" name="button_text" value="{$advInfo.button_text}">
                </div>
            </div>
            <div class="form-group">
                <label for="recipient-name" class="control-label col-sm-3">内容描述:</label>
                <div class="col-sm-6">
                    <input type="text" class="form-control" name="introduce" value="{$advInfo.introduce}">
                </div>
            </div>
            <div class="form-group">
                <label for="message-text" class="control-label col-sm-3"><span style="color:red;">*</span>广告位:</label>
                <div class="col-sm-4">
                    <select name="prid" class="form-control">
                        <option value="">--请选择--</option>
                        <volist name="advPlaces" id="item">
                            <option <if condition="$advInfo['prid'] eq $item['id']">selected="selected"</if> value="{$item.id}">{$item.name}</option>
                        </volist>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label for="recipient-name" class="control-label col-sm-3"><span style="color:red;">*</span>轮播动作对象:</label>
                <div class="col-sm-4">
                    <select name="adv_object" class="form-control">
                        <option value="">--请选择--</option>
                        <volist name="advObj" id="ao">
                            <option <if condition="$advInfo['adv_object'] eq $key">selected="selected"</if> value="{$key}">{$ao}</option>
                        </volist>
                    </select>
                   
                </div>
            </div>
            <div class="form-group">
                <label for="recipient-name" class="control-label col-sm-3"><span style="color:red;">*</span>轮播动作对象ID:</label>
                <div class="col-sm-9">
                    <select name="adv_object_id" class="form-control"></select>
                    <!--<input type="text" class="form-control" name="adv_object_id" value="{$advInfo.adv_object_id}" required>-->
                </div>
            </div>
            <div class="form-group">
                <label for="message-text" class="control-label col-sm-3">优先级:</label>           
                <div class="col-sm-2">    
                    <input type="text" class="form-control " name="position" value="{$advInfo.position}" >
                </div>
            </div>
            <div class="form-group">
                <label for="recipient-name" class="control-label col-sm-3">广告图片:</label>
                <div class="col-sm-4">
                    <if condition="$advInfo['resource'] neq ''">
                        <img id="advImg" src="__ROOT__{$advInfo.resource}" style="width:150px;" />
                        <else />

                        <img id="advImg"  src="__PUBLIC__/images/avatar.png" style="width:150px;" />
                    </if>
                    <input id="fileupload" type="file" name="files[]" multiple="" style="display: none;">
                </div>
            </div>
            <input type="hidden" name="resource" id="resource" value="{$advInfo.resource}" />
        </form>
        <div class="modal-footer">
            <button type="button" data-dismiss="modal" class="btn btn-default">取消</button>
            <button type="button" id="advSave" class="btn btn-primary">保存</button>
        </div>
    </div>
</div>
<script type="text/javascript" src="__PUBLIC__/js/jquery-upload/js/vendor/jquery.ui.widget.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/jquery-upload/js/jquery.fileupload.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/jquery-upload/js/jquery.fileupload-ui.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/jquery-upload/js/jquery.iframe-transport.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/jquery-upload/js/jquery.fileupload-process.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/select2/select2.min.js"></script>
<script>
    var aoid = "{$advInfo.adv_object_id}";
    
    $("select[name='adv_object_id']").select2({
            placeholder: "选择用户组",
            width: "100%"
        });
        
    $(function () {
        $('#advForm').validator();
    })

        $("#advSave").click(function () {
            var validator = $("#advForm").data("bs.validator");
            validator.validate();
            if(!validator.hasErrors()) {
                $.ajax({
                    url: "{:U('Admin/Content/saveAdv')}",
                    type: "post",
                    dataType: "json",
                    data: $("#advForm").serialize(),
                    success: function (data) {
                        $("#commonModal").modal('toggle');
                        common.alert("提示", "广告轮播修改成功!", function () {
                            common.reload();
                        });

                    }
                })
            }
        })
        //广告图片上传
        $("#advImg").click(function(){
            $('#fileupload').click();
        })
        $('#fileupload').fileupload({
            url: "{:U('Admin/Upload/index')}",
            dataType: "",
            formData: {type: "adver"},
            autoUpload: true,
            done: function (e, data) {
                var files = data.result;
                var file = files[0];
                $("#advImg").attr("src","__ROOT__"+file.filePath);
                $("#resource").val(file.filePath);
            }
        });
        
        $(function(){
            var ao = $("select[name='adv_object']").val();
            if(ao){
                aoi(ao,aoid);
            }
        })
        
        function aoi(type,selectedId){
            $.ajax({
                url:"{:U('Admin/Content/getAdvObjectList')}",
                type:"post",
                dataType:"json",
                data:{type:type},
                success:function(data){
                    console.log(data);
                    var html = '';
                    for(var key in data){
                        var item = data[key];
                        html += '<option value="'+item.id+'">'+item.name+'</option>';
                    }

                    $("select[name='adv_object_id']").html(html);
                    if(selectedId){
                        $("select[name='adv_object_id']").val(selectedId);
                    }
                }

            })
        }
        
        $("select[name='adv_object']").change(function(){
            var type  = $(this).val();
            aoi(type);
        })
    </script>